# Status

## Installation
`npm i @snack-uikit/status`

[Changelog](./CHANGELOG.md)

## Example

```typescript jsx
import { Status, StatusIndicator } from '@snack-uikit/status';

<Status 
  label="Text after status"
  appearance='pink'
  size='xs'
  hasBackground={true}
/>

<StatusIndicator
  appearance='violet'
  size='l'
/>
```

[//]: DOCUMENTATION_SECTION_START
[//]: THIS_SECTION_IS_AUTOGENERATED_PLEASE_DONT_EDIT_IT
## Status
### Props
| name | type | default value | description |
|------|------|---------------|-------------|
| label* | `string` | - | Текст |
| size | enum Size: `"xs"`, `"s"` | xs | Размер |
| appearance | enum Appearance: `"primary"`, `"neutral"`, `"red"`, `"orange"`, `"yellow"`, `"green"`, `"blue"`, `"violet"`, `"pink"` | primary | Внешний вид |
| hasBackground | `boolean` | - | Наличие фона |
| className | `string` | - | CSS-класс |
## StatusIndicator
### Props
| name | type | default value | description |
|------|------|---------------|-------------|
| size | enum Size: `"xs"`, `"s"`, `"xxs"`, `"m"`, `"l"` | m | Размер |
| appearance | enum Appearance: `"primary"`, `"neutral"`, `"red"`, `"orange"`, `"yellow"`, `"green"`, `"blue"`, `"violet"`, `"pink"` | primary | Внешний вид |
| className | `string` | - | CSS-класс |


[//]: DOCUMENTATION_SECTION_END
